<template>
  <div style="background-color: white">
    <BreakSpace label="基本信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel
      ref="from"
      :list="formList"
      :cols="4"
      @formChange="changeHandle"
      :isSubmitBtn="false"
      labelWidth="110" />
    <BreakSpace label="工单信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel
       ref="billfrom"
      :list="billList"
      :cols="4"
      @formChange="changeHandleBill"
      :isSubmitBtn="false"
      labelWidth="110" />
    <BreakSpace label="车辆信息" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel
      ref="car"
      :list="carList"
      :cols="4"
      @formChange="changeHandleCar"
      :isSubmitBtn="false"
      labelWidth="110" />
    <BreakSpace label="投诉调查" :containerStyle="{ marginBottom: '10px' }" />
    <FormPanel
      ref="query"
      :list="queryList"
      :cols="2"
      @formChange="changeHandlequery"
      :isSubmitBtn="false"
      labelWidth="110" />
    <div class="dialog" >
      <el-button  :loading="saveLoading" size="medium" @click="dosave"  type="primary">保存</el-button>
    </div>
    <BaseDialog
      :visible.sync="issearch"
      :title="'查询工单'"
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <workorder :rowData="formData"  @close="dealercloseHandler" />
    </BaseDialog>

    <BaseDialog :visible.sync="visbleVehicle" title="车辆选择"
                :containerStyle="{ overflow: 'auto', paddingBottom: '60px' }"
                destroyOnClose>
      <add-vehicle
        :rowData="formData"
        selectionType="single"
        @selectArr="selectVehicleFun"
        @closeDialog='visbleVehicle = false'></add-vehicle>
    </BaseDialog>
  </div>
</template>

<script>
  import { fwSubtype,pjSubtype,cpSubtype,dzSubtype,xsSubtype,complaintSerious,complaintGender,complaintType,status,sjtype,complaintOrigin } from './complaint';
  import workorder from './workorder';
  import addVehicle from '@/pages/partsmanage/purchaseManage/purchaseSubmit/addVehicle';
  import { getCurrentUser } from '@/api/cms-api/origin/construct/dealer';
  import {dosave} from '@/api/customerService/complaint/complaintbill/index.js';
  import { dictionary } from '@/utils/dictMixin';
  import { region } from '@/api/cms-common/region';
  import moment from 'moment'
    export default {
      mixins: [dictionary,region],
      name: "index",
      components: {
        workorder,addVehicle
      },
      data() {
        this.saveData=null;
        return{
          visbleVehicle: false,
          roNo:'',// 工单号
          roCreateDate:'',// 开单日期
          issearch:false,
          formData:{carvin:'',ronovin:''},
          saveLoading:false,
          showAddNew:true,
          carvin:'',
          ronovin:'',
          billList:this.createTopFilterList(2),
          formList: this.createTopFilterList(1),
          carList:this.createTopFilterList(3),
          queryList:this.createTopFilterList(4),
          dealerId:'', //经销商的id
          dealerCode:'', //经销商代码
          rono:'', //订单号
          ronoId:'',// 订单的ID
          vin:'',
          carID:''//车源的ID
        };
      },
      created() {
        this.getuser()
      },
      methods: {
        getuser(){
          // 获取当前登录人信息
          getCurrentUser({}).then(response=>{
            this.dealerId=response.data.ownerId
            this.dealerCode=response.data.ownerCode
            this.formList.find(res=>res.fieldName=='receptionist').initialValue=response.data.userName
          })
        },
        // 选择完工单后返回处理数据
        dealercloseHandler(val){
          if (val){
            this.rono=val[0].roNo
            this.ronoId=val[0].ronoId
            this.ronovin=val[0].vin
            this.billList.find(res=>res.fieldName=='rono').initialValue=val[0].roNo
            this.billList.find(res=>res.fieldName=='ronoDate').initialValue=val[0].roCreateDate
            this.billList.find(res=>res.fieldName=='ronotype').initialValue=val[0].roType
            this.billList.find(res=>res.fieldName=='ronoGw').initialValue=val[0].serviceAdvisor
            this.billList.find(res=>res.fieldName=='ronoSxr').initialValue=val[0].deliverer
            this.billList.find(res=>res.fieldName=='ronoSxrPhone').initialValue=val[0].delivererMobile
            this.billList.find(res=>res.fieldName=='ronoSxrDh').initialValue=val[0].delivererPhone
            this.billList.find(res=>res.fieldName=='ronoZrjs').initialValue=val[0].chiefTechnician
            this.carID=val[0].id
            this.carvin=val[0].vin
            this.vin=val[0].vin
            this.carList.find(res=>res.fieldName=='carCp').initialValue=val[0].license
            this.carList.find(res=>res.fieldName=='vin').initialValue=val[0].vin
            this.carList.find(res=>res.fieldName=='carCz').initialValue=val[0].ownerName
            this.carList.find(res=>res.fieldName=='carXz').initialValue=this.createDictText(val[0].ownerProperty, '8011')
            this.carList.find(res=>res.fieldName=='carLc').initialValue=val[0].currentMileage
            this.carList.find(res=>res.fieldName=='carRq').initialValue=val[0].salesDate
            // this.carList.find(res=>res.fieldName=='carDz').initialValue=val[0].address
            this.carList.find(res=>res.fieldName=='modelName').initialValue=val[0].modelName
          }
          this.issearch=false
        },
        // 保存
        async dosave(){
          let [err, data] = await this.$refs.from.GET_FORM_DATA();
          let [err1,data1] = await this.$refs.billfrom.GET_FORM_DATA();
          let [err2,data2] = await this.$refs.query.GET_FORM_DATA();
          if (!err && !err1 && !err2 ){
            const datas = Object.assign(data,data2,{dealerId:this.dealerId,dealerCode:this.dealerCode,rono:this.rono,ronoId:this.ronoId,vin:this.vin,jaStatus:'W',carId:this.carID})
            datas.complaintDate =  moment(datas.complaintDate).format('YYYY-MM-DD HH:mm:ss')
            this.saveLoading=true
            dosave(datas).then(response=>{
              if (response.resultCode === 200) {
                this.$notify.success({title: '提示信息',message:'保存成功!'});
                this.clearfrom()
              }else {
                this.$notify.error({title: '提示信息',message:res.errMsg||'保存失败!'});
                this.clearfrom()
              }
            })
          }
        },
        //重置表单
        clearfrom(){
          this.saveLoading=false
          this.$refs.from.RESET_FORM()
          this.$refs.billfrom.RESET_FORM()
          this.$refs.query.RESET_FORM()
          this.$refs.car.RESET_FORM()
        },
        // 查询工单
        seacherFun(){
          this.issearch=true
          this.formData.carvin=this.carvin
        },
        createTopFilterList(type) {
          if (type===1){
            return [{//2
              type: 'INPUT',
              label: '投诉单编号',
              fieldName: 'complaintNo',
              hidden:true,
              initialValue:'',
              disabled:true
            },
              {//3
                type: 'INPUT',
                label: '投诉人姓名',
                fieldName: 'complaintName',
                initialValue: '',
                placeholder: '请输入',
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//3
                type: 'SELECT',
                label: '投诉人性别',
                fieldName: 'complaintGender',
                initialValue: '',
                placeholder: '选择',
                itemList:complaintGender,
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//14
                type: 'INPUT',
                label: '投诉人电话',
                fieldName: 'complaintPhone',
                placeholder: '请输入',
                initialValue: '',
                maxlength:11,
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'blur'
                  },
                  {
                    pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
                    message: '请填写正确的手机格式',
                    trigger: 'blur'
                  }
                ]
              },
              {//3
                type: 'SELECT',
                label: '投诉类型',
                fieldName: 'complaintType',
                initialValue: '',
                placeholder: '选择',
                itemList:complaintType,
                change:this.changeComplaintType,
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//3
                type: 'SELECT',
                label: '投诉子类',
                fieldName: 'complaintSubtype',
                initialValue: '',
                placeholder: '选择',
                itemList:[],
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//3
                type: 'DATE_TIME',
                label: '投诉日期',
                fieldName: 'complaintDate',
                initialValue: new Date(),
                placeholder: '选择',
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//3
                type: 'SELECT',
                label: '处理状态',
                fieldName: 'status',
                initialValue: 'A',
                placeholder: '选择',
                itemList:status,
                disabled: true
              },
              {
                type: 'INPUT',
                label: '接待员',
                fieldName: 'receptionist',
                initialValue: '',
                disabled:true
              },
              {//3
                type: 'SELECT',
                label: '数据来源',
                fieldName: 'type',
                initialValue: 'C',
                placeholder: '选择',
                itemList:sjtype,
                disabled: true,
              },
              {//3
                type: 'SELECT',
                label: '投诉来源',
                fieldName: 'complaintOrigin',
                initialValue: '',
                placeholder: '选择',
                itemList:complaintOrigin,
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {//3
                type: 'SELECT',
                label: '投诉等级',
                fieldName: 'complaintSerious',
                initialValue: '',
                placeholder: '选择',
                itemList:complaintSerious,
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'change'
                  }
                ]
              },
              {
                type: 'INPUT',
                label: '被投诉部门',
                fieldName: 'department',
                initialValue:'',
              },
              {
                type: 'INPUT',
                label: '被投诉员工',
                fieldName: 'beComplainTemp',
                initialValue:'',
              },
              {//22
                type: 'TEXT_AREA',
                label: '投诉单位',
                fieldName: 'complaintCorp',
                placeholder: '请输入',
                initialValue: '',
                maxlength:100,
                selfCols:4, //独占行数
              }
            ]
          }else if(type===2) {
            return[
              {//2
                type: 'INPUT',
                label: '工单号',
                fieldName: 'rono',
                initialValue:'',
                readonly:true,
                unitRender: () => {
                  return (
                    <div>
                      <el-button icon="el-icon-search" onClick={() => this.seacherFun()}></el-button>
                      <el-button slot="append" icon="el-icon-delete" onClick={() => this.clearSelectModel()}></el-button>
                    </div>
                  );
                }
              },
              {//3
                type: 'DATE',
                label: '开单日期',
                fieldName: 'ronoDate',
                initialValue: '',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '维修类型',
                fieldName: 'ronotype',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '服务顾问',
                fieldName: 'ronoGw',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '送修人',
                fieldName: 'ronoSxr',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '送修人手机',
                fieldName: 'ronoSxrPhone',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '送修人电话',
                fieldName: 'ronoSxrDh',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '责任技师',
                fieldName: 'ronoZrjs',
                initialValue:'',
                disabled:true
              }
            ]
          }else if (type===3){
            return[
              {//2
                type: 'INPUT',
                label: '车牌号',
                fieldName: 'carCp',
                initialValue:'',
                readonly:true,
                unitRender: () => {
                  return (
                    <div>
                      <el-button icon="el-icon-search" onClick={() => this.openvehicle()}></el-button>
                      <el-button slot="append" icon="el-icon-delete" onClick={() => this.clearSelectModel()}></el-button>
                    </div>
                  );
                }
              },
              {//2
                type: 'INPUT',
                label: '车型',
                fieldName: 'modelName',
                initialValue:'',
                disabled:true,
              },
              {//3
                type: 'INPUT',
                label: 'VIN',
                fieldName: 'vin',
                initialValue: '',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '车主',
                fieldName: 'carCz',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '车主性质',
                fieldName: 'carXz',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'INPUT',
                label: '行驶里程',
                fieldName: 'carLc',
                initialValue:'',
                disabled:true
              },
              {//2
                type: 'DATE',
                label: '购车日期',
                fieldName: 'carRq',
                initialValue:'',
                disabled:true
              },
              // {//2
              //   type: 'INPUT',
              //   label: '车主地址',
              //   fieldName: 'carDz',
              //   initialValue:'',
              //   disabled:true,
              //   selfCols:2, //独占行数
              // }
            ]
          }else{
            return [
              {//22
                type: 'TEXT_AREA',
                label: '投诉摘要',
                fieldName: 'complaintSummary',
                placeholder: '请输入',
                initialValue: '',
                rules: [
                  {
                    required: true,
                    message: '必填',
                    trigger: 'blur'
                  }
                ]
              },
              {//22
                type: 'TEXT_AREA',
                label: '投诉原因',
                fieldName: 'complaintReason',
                placeholder: '请输入',
                initialValue: ''
              },
              {//22
                type: 'TEXT_AREA',
                label: '备注信息',
                fieldName: 'remark',
                placeholder: '请输入',
                initialValue: ''
              },
              {//22
                type: 'TEXT_AREA',
                label: '解决方案',
                fieldName: 'resolvent',
                placeholder: '请输入',
                initialValue: ''
              }
            ]
          }
        },
        // 清空工单信息和车辆信息
        clearSelectModel(){
          this.carID=''
          this.rono=''
          this.ronoId=''
          this.vin=''
          this.carvin=''
          this.ronovin=''
          this.formData.ronovin=''
          this.formData.carvin=''
          this.$refs.billfrom.RESET_FORM()
          this.$refs.car.RESET_FORM()
        },
        openvehicle(){
          this.visbleVehicle = true
          this.formData.ronovin=this.ronovin
        },
        /*选择车辆信息回调 */
        selectVehicleFun(arr) {
          if (arr){
            this.carID=arr[0].id
            this.carvin=arr[0].vin
            this.vin=arr[0].vin
            this.carList.find(res=>res.fieldName=='carCp').initialValue=arr[0].license
            this.carList.find(res=>res.fieldName=='vin').initialValue=arr[0].vin
            this.carList.find(res=>res.fieldName=='carCz').initialValue=arr[0].ownerName
            this.carList.find(res=>res.fieldName=='carXz').initialValue=this.createDictText(arr[0].ownerProperty, '8011')
            this.carList.find(res=>res.fieldName=='carLc').initialValue=arr[0].currentMileage
            this.carList.find(res=>res.fieldName=='carRq').initialValue=arr[0].salesDate
            // this.carList.find(res=>res.fieldName=='carDz').initialValue=arr[0].address
            this.carList.find(res=>res.fieldName=='modelName').initialValue=arr[0].modelName
          }
          this.visbleVehicle = false
        },
        changeComplaintType(type){
          this.formList.forEach(item=>{
            if (type==='X'&& item.fieldName=='complaintSubtype'){//销售的子类
              item.itemList=[]
              item.initialValue=''
              item.itemList=xsSubtype
            }else if (type==='D'&& item.fieldName=='complaintSubtype'){ // 电桩的子类
              item.itemList=[]
              item.initialValue=''
              item.itemList=dzSubtype
            }else if (type==='F'&& item.fieldName=='complaintSubtype'){ //服务的子类
              item.itemList=[]
              item.initialValue=''
              item.itemList=fwSubtype
            }else if (type==='P'&& item.fieldName=='complaintSubtype'){ //配件的子类
              item.itemList=[]
              item.initialValue=''
              item.itemList=pjSubtype
            }else if(type==='C'&& item.fieldName=='complaintSubtype'){ //产品
              item.itemList=[]
              item.initialValue=''
              item.itemList=cpSubtype
            }
         })
        },
        changeHandle(val) {
          this.saveData=val;
        },
        changeHandleBill(val){
          console.info(val)
        },
        changeHandleCar(val){
          console.info(val)
        } ,
        changeHandlequery(val){
          console.info(val)
        }
      }
    }
</script>

<style scoped>
  .dialog{
    left: 0px;  bottom: 0px;
    right: 0px;
    padding: 50px 20px;
    background: #fff;
    text-align: right;
    z-index: 9;
  }

</style>
